@use "sass:math";
@use 'base';

$primary-color: rgb(121, 202, 242);

.title {
  background: $primary-color;
  display: inline-block;
  color: base.$base-color
}

nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  li { display: inline-block; }

  a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
  }
}

@mixin theme($theme: DarkGray) {
  background: $theme;
  box-shadow: 0 0 1px rgba($theme, .25);
  color: #fff;
}

.info {
  @include theme;
}

article[role="main"] {
  width: math.div(600px, 960px) * 100%;
}
